<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('选择房间弹窗')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-inline m" th:object="${room}">
        <div class="form-group">
            <label class="col-xs-3 control-label">所属社区：</label>
            <div class="col-xs-3">
                <div class="input-group">
                    <input name="sqName" autocomplete="off" onclick="selectDeptTree()" id="sqName" type="text"
                           placeholder="请选择归属社区" th:field="*{sqName}"
                           class="form-control" >
                    <input name="sqCode" id="sqCode" th:field="*{sqCode}" type="text" style="display: none;">
                    <span class="input-group-addon"><i class="fa fa-search"></i></span>
                </div>
            </div>
            <script type="text/javascript">
                /* 选择部门树 */
                function selectDeptTree() {
                    var treeId = $("#sqCode").val();
                    var deptId = $.common.isEmpty(treeId) ? "100" : $("#sqCode").val();
                    // var deptId = "100";
                    var url = ctx + "system/dept/selectDeptTree/" + deptId;
                    var options = {
                        title: '选择部门',
                        width: "380",
                        url: url,
                        callBack: doSubmit
                    };
                    $.modal.openOptions(options);
                };

                function doSubmit(index, layero) {
                    var tree = layero.find("iframe")[0].contentWindow.$._tree;
                    if ($.tree.notAllowParents(tree)) {
                        var body = layer.getChildFrame('body', index);
                        $("#sqCode").val(body.find('#treeId').val());
                        $("#sqName").val(body.find('#treeName').val());
                        layer.close(index);
                        getCsmcList();
                    }
                }
            </script>
        </div>
        <div class="form-group">
            <label class="col-xs-3 control-label ">所属场所类型：</label>
            <div class="col-xs-3">
                <select onchange="getCsmcList()" name="sscsLx" class="form-control m-b" th:with="type=${@dict.getType('b_zzslx')}" >
                    <option value="">未选择</option>
                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{sscsLx}"></option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-3 control-label ">暂住所名称：</label>
            <div class="col-xs-3">
                <select onchange="getLhList()" name="sscsMc" class="form-control m-b" >
                    <option value="">未选择</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-3 control-label ">楼号：</label>
            <div class="col-xs-3">
                <select onchange="getRoomList()" name="lh" class="form-control m-b" >
                    <option value="">未选择</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-3 control-label ">房间号：</label>
            <div class="col-xs-3">
                <select name="fjNum" id="fjNum" class="form-control" >
                    <option value="">未选择</option>
                </select>
            </div>
        </div>
    </form>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    /*var prefix = ctx + "lwsq/lwsq"
    var aValidator = $("#form-lwsq-add").validate({
        focusCleanup: true
    });*/


    $(function () {
        getCsmcList();
    })

    /**
     * 获取场所名称列表
     */
    function getCsmcList() {
        var sqCode = $("input[name=sqCode]").val();
        var sscsLx = $("select[name=sscsLx]").find("option:selected").val();
        if ($.common.trim(sqCode) != "" && $.common.trim(sscsLx) != "") {
            var data = {
                "sqCode": sqCode,
                "sscsLx": sscsLx
            }
            var url = ctx + "place/building/csmclist";
            $.ajax({
                type: "post",
                contentType: 'application/json;charset=UTF-8',
                data: JSON.stringify(data),
                url: url,
                dataType: "json",
                success: function (result) {
                    if (result.code == 0) {
                        $("select[name=sscsMc]").find("option:not(:first)").remove()
                        $("select[name=lh]").find("option:not(:first)").remove()
                        $("select[name=fjNum]").find("option:not(:first)").remove()
                        $.each(result.data, function (i, n) {
                            var option = $("<option></option>");
                            option.val(n).text(n);
                            $("select[name=sscsMc]").append(option);
                        })
                    } else {
                        $.modal.msgError(result.msg);
                    }
                }
            })
        } else {
            $("select[name=sscsMc]").find("option:not(:first)").remove();
        }
    }
    /**
     * 获取楼号列表
     */
    function getLhList() {
        var sqCode = $("input[name=sqCode]").val();
        var sscsLx = $("select[name=sscsLx]").find("option:selected").val();
        var sscsMc = $("select[name=sscsMc]").find("option:selected").val();
        if ($.common.trim(sqCode) != "" && $.common.trim(sscsLx) != "" && $.common.trim(sscsMc) != "") {
            var data="sqCode="+sqCode+"&sscsLx="+sscsLx+"&sscsMc="+sscsMc;
            var url = ctx + "place/building/list";
            $.ajax({
                type: "post",
                url: url+"?"+data,
                dataType: "json",
                success: function (result) {
                    if (result.code == 0) {
                        $("select[name=lh]").find("option:not(:first)").remove()
                        $("select[name=fjNum]").find("option:not(:first)").remove()
                        $.each(result.rows, function (i, n) {
                            var option = $("<option></option>");
                            option.val(n.lh).text(n.lh);
                            $("select[name=lh]").append(option);
                        })
                    } else {
                        $.modal.msgError(result.msg);
                    }
                }
            })
        } else {
            $("select[name=lh]").find("option:not(:first)").remove();
        }
    }
    /**
     * 获取房间列表
     */
    function getRoomList() {
        var sqCode = $("input[name=sqCode]").val();
        var sscsLx = $("select[name=sscsLx]").find("option:selected").val();
        var sscsMc = $("select[name=sscsMc]").find("option:selected").val();
        var lh = $("select[name=lh]").find("option:selected").val();
        if ($.common.trim(sqCode) != ""
            && $.common.trim(sscsLx) != ""
            && $.common.trim(sscsMc) != ""
            && $.common.trim(lh) != ""
        ) {
            var data="sqCode="+sqCode+"&sscsLx="+sscsLx+"&sscsMc="+sscsMc+"&lh="+lh;
            var url = ctx + "place/room/list";
            $.ajax({
                type: "post",
                url: url+"?"+data,
                dataType: "json",
                success: function (result) {
                    if (result.code == 0) {
                        $("select[name=fjNum]").find("option:not(:first)").remove()
                        $.each(result.rows, function (i, n) {
                            var option = $("<option></option>");
                            option.val(n.id).text(n.roomCode);
                            $("select[name=fjNum]").append(option);
                        })
                    } else {
                        $.modal.msgError(result.msg);
                    }
                }
            })
        } else {
            $("select[name=fjNum]").find("option:not(:first)").remove();
        }
    }
</script>
</body>
</html>